<script setup lang="ts">
import { twMerge } from "tailwind-merge";
import { onMounted } from "vue";

defineProps<{
  contentHeight?: string;
  sticky?: boolean;
}>();

onMounted(() => {});
</script>

<template>
  <view v-if="contentHeight" class="safe-footer">
    <view class="safe-footer" :style="{ height: contentHeight }" />
  </view>

  <view
    :class="
      twMerge(
        'fixed bottom-0 w-full z-10 bg-white safe-footer',
        sticky && 'sticky'
      )
    "
  >
    <slot />
  </view>
</template>
